<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>豆瓣音乐</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/music.css">
</head>
<body>
<!-- 头部 -->
<div id="header">
    <div id="list">
        <ul>
            <li><a href="main.html">豆瓣</a></li>
            <li><a href="#">读书</a></li>
            <li><a href="#">电影</a></li>
            <li><a href="#">音乐</a></li>
            <li><a href="#">同城</a></li>
            <li><a href="#">小组</a></li>
            <li><a href="#">阅读</a></li>
            <li><a href="#">F M</a></li>
            <li><a href="#">东西</a></li>
            <li><a href="#">集市</a></li>
            <li><a href="#">更多</a></li>
        </ul>
        <div class="head-rig">
            <span><a href="#">下载豆瓣客户端</a></span>
            <span><a href="#">豆邮</a></span>
            <span><a href="#">提醒</a></span>
            <span><a href="#">NINY的帐号</a></span>
        </div>
    </div>
    <div id="search">
        <a href="music.html"><img src="images/music/music.png" /></a>
        <input type="text" placeholder="唱片名、表演者、条码、ISRC..."/>
        <hr />
        <div class="sea-lis">
            <ul>
                <li><a href="#">音乐人</a></li>
                <li><a href="#">金羊毛计划</a></li>
                <li><a href="#">专题</a></li>
                <li><a href="#">排行榜</a></li>
                <li><a href="#">分类浏览</a></li>
                <li><a href="#">乐评</a></li>
                <li><a href="#">豆瓣FM</a></li>
                <li><a href="#">歌单</a></li>
                <li><a href="#">阿鹿比2016</a></li>
            </ul>
        </div>
        <img class="six" src="images/music/music2016.png" />
    </div>
</div>
<!-- 头部结束 -->
<div id="content">
    <div id="main">
    	<div id="left">
            <!-- 轮播图 -->
        	<div id="ads">
                <img src="./images/music/img1.jpg" alt="" class="show" />
                <img src="./images/music/img2.jpg" alt="" />
                <img src="./images/music/img3.jpg" alt="" />
                <img src="./images/music/img4.jpg" alt="" />
                <img src="./images/music/img5.jpg" alt="" />
                <img src="./images/music/img6.jpg" alt="" />
                <ul>
                    <li class="active"></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
			</div>
            <!-- 轮播图结束 -->
            <!-- 音乐人 -->
        	<div id="musical">
                <span><em id="fash1" class="show1">本周流行音乐人</em>|<em id="quik1">上升最快音乐人</em></span>
                <hr />
                <div id="fash" class="show">
                	<ul>
                    	<li>
                        	<img src="images/music/2.png" />
                            <span>
                            	<a href="#">好妹妹</a>
                                <em>民谣 Folk</em>
                            </span>
                        </li>
                        <li>
                            <img src="images/music/1.png" />
                            <span>
                                <a href="#">放肆的肆</a>
                                <em>流行 Pop</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/3.png" />
                            <span>
                            	<a href="#">放肆的肆</a>
                                <em>世界音乐 World</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/4.png" />
                            <span>
                            	<a href="#">梁晓雪</a>
                                <em>民谣 Folk</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/5.png" />
                            <span>
                            	<a href="#">贰佰</a>
                                <em>民谣 Folk</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/6.png" />
                            <span>
                            	<a href="#">宋冬野</a>
                                <em>民谣 Folk</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/7.png" />
                            <span>
                            	<a href="#">Mirrors解离的真实</a>
                                <em>摇滚 Rock</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/8.png" />
                            <span>
                            	<a href="#">左小祖咒</a>
                                <em>摇滚 Rock</em>
                            </span>
                        </li>
                    </ul>
                </div>
                <div id="quik">
                	<ul>
                    	<li>
                        	<img src="images/music/8.png" />
                            <span>
                            	<a href="#">左小祖咒</a>
                                <em>摇滚 Rock</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/7.png" />
                            <span>
                            	<a href="#">Mirrors解离的真实</a>
                                <em>摇滚 Rock</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/5.png" />
                            <span>
                            	<a href="#">贰佰</a>
                                <em>民谣 Folk</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/6.png" />
                            <span>
                            	<a href="#">宋冬野</a>
                                <em>民谣 Folk</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/2.png" />
                            <span>
                            	<a href="#">好妹妹</a>
                                <em>民谣 Folk</em>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/3.png" />
                            <span>
                            	<a href="#">放肆的肆</a>
                                <em>世界音乐 World</em>
                            </span>
                        </li>
                        <li>
                            	<img src="images/music/1.png" />
                                <span>
                                    <a href="#">放肆的肆</a>
                                    <em>流行 Pop</em>
                                </span>
                        </li>
                        <li>
                        	<img src="images/music/4.png" />
                            <span>
                            	<a href="#">梁晓雪</a>
                                <em>民谣 Folk</em>
                            </span>
                        </li>
                    </ul>
                </div>
            </div>
            <!-- 音乐人结束 -->
            <!-- 编辑推荐 -->
        	<div id="send">
            	<span class="sen1">编辑推荐</span>
        		<span id="but1">&lt;</span>
        		<span id="but2">&gt;</span>
                <hr />
                <div id="sen2" class="show">
                	<ul>
                    	<li>
                        	<img src="images/music/sen1.png" />
                            <span>
                            	<em>【歌曲】</em>
                            	<a href="#">解离的真实</a>
                                <em>tathtimi</em>
                                <p>采样拼贴，好听的小情绪，雾霾散去的时候，可以听一个。</p>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/sen2.png" />
                            <span>
                            	<em>【歌曲】</em>
                            	<a href="#">止语</a>
                                <em>tathtimi</em>
                                <p>采样拼贴，好听的小情绪，雾霾散去的时候，可以听一个。</p>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/sen3.png" />
                            <span>
                            	<em>【歌曲】</em>
                            	<a href="#">现场录音</a>
                                <em>tathtimi</em>
                                <p>采样拼贴，好听的小情绪，雾霾散去的时候，可以听一个。</p>
                            </span>
                        </li>
                    </ul>
                </div>
                <div id="sen3">
                	<ul>
                    	<li>
                        	<img src="images/music/sen4.png" />
                            <span>
                            	<em>【歌曲】</em>
                            	<a href="#">解离的真实</a>
                                <em>tathtimi</em>
                                <p>采样拼贴，好听的小情绪，雾霾散去的时候，可以听一个。</p>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/sen5.png" />
                            <span>
                            	<em>【歌曲】</em>
                            	<a href="#">止语</a>
                                <em>tathtimi</em>
                                <p>采样拼贴，好听的小情绪，雾霾散去的时候，可以听一个。</p>
                            </span>
                        </li>
                        <li>
                        	<img src="images/music/sen6.png" />
                            <span>
                            	<em>【歌曲】</em>
                            	<a href="#">现场录音</a>
                                <em>tathtimi</em>
                                <p>采样拼贴，好听的小情绪，雾霾散去的时候，可以听一个。</p>
                            </span>
                        </li>
                    </ul>
                </div>
            </div>
            <!-- 编辑推荐 -->
        </div>
    	<div id="right">
            <!-- 加入 -->
        	<div class="rig-top">
            	<img src="images/music/ad.jpg" />
                <div class="top-lis">
                	<ul>
                    	<li>
                        	<strong>40385</strong>
                            <span>音乐人</span>
                        </li>
                        <li>
                        	<strong>2474</strong>
                            <span>播客</span>
                        </li>
                        <li>
                        	<strong>946</strong>
                            <span>厂牌</span>
                        </li>
                    </ul>
                    <div class="join">我要加入</div>
                </div>
        	</div>
            <!-- 加入结束 -->
            <!-- 单曲榜 -->
            <div id="hot">
            	 <strong>本周单曲榜</strong>
        		 <div class="but3">播放全部</div>
				 <hr />
    			 <ul>
                    <li><a class="sec" href="javascript:;">最热</a> |</li>
                    <li><a href="javascript:;">摇滚</a> |</li>
                    <li><a href="javascript:;">民谣</a> |</li>
                    <li><a href="javascript:;">流行</a> |</li>
                    <li><a href="javascript:;">电子</a> |</li>
                </ul>
                <div id="hot-lis">
                	<ul class="sec">
                		<li>
                    	<img src="images/music/6.png" />
                        <em>2016—1 gyc demo</em>
                        <span>宋冬野 / 4008次播放</span>
                        <h1>1</h1>
                    </li>
                    	<li>
                    	<img src="images/music/1.png" />
                        <em>不想回家</em>
                        <span>放肆的肆 / 7474次播放</span>
                        <h1>2</h1>
                    </li>
                    	<li>
                    	<img src="images/music/2.png" />
                        <em>不如听一首歌</em>
                        <span>好妹妹 / 2134次播放</span>
                        <h1>3</h1>
                    </li>
                    	<li>
                    	<img src="images/music/3.png" />
                        <em>Walk alone in Christmas</em>
                        <span>梁晓雪 / 8668次播放</span>
                        <h1>4</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>嘿，抬头！</em>
                        <span>贰佰 / 11666次播放</span>
                        <h1>5</h1>
                    </li>
                    	<li>
                    	<img src="images/music/5.png" />
                        <em>what the hell</em>
                        <span>max vol / 3918次播放</span>
                        <h1>6</h1>
                    </li>
                    	<li>
                    	<img src="images/music/7.png" />
                        <em>Afflatus</em>
                        <span>花镜泉 / 1899次播放</span>
                        <h1>7</h1>
                    </li>
                    	<li>
                    	<img src="images/music/8.png" />
                        <em>繁花</em>
                        <span>丁源 / 847次播放</span>
                        <h1>8</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>海市蜃楼the mirage</em>
                        <span>Mirrors解离的真实 / 661次播放</span>
                        <h1>9</h1>
                    </li>
                   		<li>
                    	<img src="images/music/6.png" />
                        <em>把悲伤留给自己（左小祖...</em>
                        <span>左小祖咒 / 10187次播放</span>
                        <h1>10</h1>
                    </li>
                	</ul>
                    <ul>
                		<li>
                    	<img src="images/music/1.png" />
                        <em>不想回家</em>
                        <span>放肆的肆 / 7474次播放</span>
                        <h1>1</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>嘿，抬头！</em>
                        <span>贰佰 / 11666次播放</span>
                        <h1>2</h1>
                    </li>
                    	<li>
                    	<img src="images/music/2.png" />
                        <em>不如听一首歌</em>
                        <span>好妹妹 / 2134次播放</span>
                        <h1>3</h1>
                    </li>
                    	<li>
                    	<img src="images/music/3.png" />
                        <em>Walk alone in Christmas</em>
                        <span>梁晓雪 / 8668次播放</span>
                        <h1>4</h1>
                    </li>
                    	<li>
                    	<img src="images/music/6.png" />
                        <em>把悲伤留给自己（左小祖...</em>
                        <span>左小祖咒 / 10187次播放</span>
                        <h1>5</h1>
                    </li>
                    	<li>
                    	<img src="images/music/6.png" />
                        <em>2016—1 gyc demo</em>
                        <span>宋冬野 / 4008次播放</span>
                        <h1>6</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>海市蜃楼the mirage</em>
                        <span>Mirrors解离的真实 / 661次播放</span>
                        <h1>7</h1>
                    </li>
                    	<li>
                    	<img src="images/music/7.png" />
                        <em>Afflatus</em>
                        <span>花镜泉 / 1899次播放</span>
                        <h1>8</h1>
                    </li>
                    	<li>
                    	<img src="images/music/8.png" />
                        <em>繁花</em>
                        <span>丁源 / 847次播放</span>
                        <h1>9</h1>
                    </li>
                   		<li>
                    	<img src="images/music/5.png" />
                        <em>what the hell</em>
                        <span>max vol / 3918次播放</span>
                        <h1>10</h1>
                    </li>
                	</ul>
                    <ul>
                		<li>
                    	<img src="images/music/7.png" />
                        <em>Afflatus</em>
                        <span>花镜泉 / 1899次播放</span>
                        <h1>1</h1>
                    </li>
                    	<li>
                    	<img src="images/music/1.png" />
                        <em>不想回家</em>
                        <span>放肆的肆 / 7474次播放</span>
                        <h1>2</h1>
                    </li>
                    	<li>
                    	<img src="images/music/2.png" />
                        <em>不如听一首歌</em>
                        <span>好妹妹 / 2134次播放</span>
                        <h1>3</h1>
                    </li>
                    	<li>
                    	<img src="images/music/6.png" />
                        <em>把悲伤留给自己（左小祖...</em>
                        <span>左小祖咒 / 10187次播放</span>
                        <h1>4</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>嘿，抬头！</em>
                        <span>贰佰 / 11666次播放</span>
                        <h1>5</h1>
                    </li>
                    	<li>
                    	<img src="images/music/5.png" />
                        <em>what the hell</em>
                        <span>max vol / 3918次播放</span>
                        <h1>6</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>海市蜃楼the mirage</em>
                        <span>Mirrors解离的真实 / 661次播放</span>
                        <h1>7</h1>
                    </li>
                    	<li>
                    	<img src="images/music/3.png" />
                        <em>Walk alone in Christmas</em>
                        <span>梁晓雪 / 8668次播放</span>
                        <h1>8</h1>
                    </li>
                    	<li>
                    	<img src="images/music/6.png" />
                        <em>2016—1 gyc demo</em>
                        <span>宋冬野 / 4008次播放</span>
                        <h1>9</h1>
                    </li>
                   		<li>
                    	<img src="images/music/8.png" />
                        <em>繁花</em>
                        <span>丁源 / 847次播放</span>
                        <h1>10</h1>
                    </li>
                	</ul>
                    <ul>
                		<li>
                    	<img src="images/music/5.png" />
                        <em>what the hell</em>
                        <span>max vol / 3918次播</span>
                        <h1>1</h1>
                    </li>
                    	<li>
                    	<img src="images/music/8.png" />
                        <em>繁花</em>
                        <span>丁源 / 847次播放</span>
                        <h1>2</h1>
                    </li>
                    	<li>
                    	<img src="images/music/2.png" />
                        <em>不如听一首歌</em>
                        <span>放好妹妹 / 2134次播放</span>
                        <h1>3</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>嘿，抬头！</em>
                        <span>贰佰 / 11666次播放</span>
                        <h1>4</h1>
                    </li>
                    	<li>
                    	<img src="images/music/1.png" />
                        <em>不想回家</em>
                        <span>放肆的肆 / 7474次播放</span>
                        <h1>5</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>海市蜃楼the mirage</em>
                        <span>Mirrors解离的真实 / 661次播放</span>
                        <h1>6</h1>
                    </li>
                    	<li>
                    	<img src="images/music/6.png" />
                        <em>把悲伤留给自己（左小祖...</em>
                        <span>左小祖咒 / 10187次播放</span>
                        <h1>7</h1>
                    </li>
                    	<li>
                    	<img src="images/music/3.png" />
                        <em>Walk alone in Christmas</em>
                        <span>梁晓雪 / 8668次播放</span>
                        <h1>8</h1>
                    </li>
                    	<li>
                    	<img src="images/music/7.png" />
                        <em>Afflatus</em>
                        <span>花镜泉 / 1899次播放</span>
                        <h1>9</h1>
                    </li>
                   		<li>
                    	<img src="images/music/6.png" />
                        <em>2016—1 gyc demo</em>
                        <span>宋冬野 / 4008次播放</span>
                        <h1>10</h1>
                    </li>
                	</ul>
                    <ul>
                	<li>
                    	<img src="images/music/2.png" />
                        <em>不如听一首歌</em>
                        <span>好妹妹 / 2134次播放</span>
                        <h1>1</h1>
                    </li>
                    	<li>
                    	<img src="images/music/1.png" />
                        <em>不想回家</em>
                        <span>放肆的肆 / 7474次播放</span>
                        <h1>2</h1>
                    </li>
                    	<li>
                    	<img src="images/music/7.png" />
                        <em>Afflatus</em>
                        <span>花镜泉 / 1899次播放</span>
                        <h1>3</h1>
                    </li>
                    	<li>
                    	<img src="images/music/3.png" />
                        <em>Walk alone in Christmas</em>
                        <span>梁晓雪 / 8668次播放</span>
                        <h1>4</h1>
                    </li>
                    	<li>
                    	<img src="images/music/8.png" />
                        <em>繁花</em>
                        <span>丁源 / 847次播放</span>
                        <h1>5</h1>
                    </li>
                    	<li>
                    	<img src="images/music/6.png" />
                        <em>把悲伤留给自己（左小祖...</em>
                        <span>左小祖咒 / 10187次播放</span>
                        <h1>6</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>嘿，抬头！</em>
                        <span>贰佰 / 11666次播放</span>
                        <h1>7</h1>
                    </li>
                    	<li>
                    	<img src="images/music/4.png" />
                        <em>海市蜃楼the mirage</em>
                        <span>Mirrors解离的真实 / 661次播放</span>
                        <h1>8</h1>
                    </li>
                    	<li>
                    	<img src="images/music/5.png" />
                        <em>what the hell</em>
                        <span>max vol / 3918次播放</span>
                        <h1>9</h1>
                    </li>
                   		<li>
                    	<img src="images/music/6.png" />
                        <em>2016—1 gyc demo</em>
                        <span>宋冬野 / 4008次播放</span>
                        <h1>10</h1>
                    </li>
                	</ul>
                </div>
            </div>
            <!-- 单曲榜结束 -->
        </div>
    </div>
    <!-- 底部 -->
    <div id="footer">
    	© 2005－2017 douban.com, all rights reserved 北京豆网科技有限公司 
        <ul>
        	<li><a href="#">关于豆瓣·</a></li>
            <li><a href="#">在豆瓣工作 ·</a></li>
            <li><a href="#">联系我们 ·</a></li>
            <li><a href="#">免责声明 ·</a></li>
            <li><a href="#">帮助中心 ·</a></li>
            <li><a href="#">移动应用 ·</a></li>
            <li><a href="#">豆瓣广告</a></li>
        </ul>
    </div>
    <!-- 底部结束 -->
</div>

<script src="./js/music.js"></script>
</body>
</html>
